<template>
  <view>
    <view class="line">
      <image src="/static/line.jpg" v-if="addressList.length"></image>
    </view>
    <view
      class="address-management"
      :class="addressList.length < 1 && page > 1 ? 'fff' : ''"
    >
      <radio-group
        class="radio-group"
        @change="radioChange"
        v-if="addressList.length"
      >
        <view
          class="item borRadius14"
          v-for="(item, index) in addressList"
          :key="index"
        >
          <view class="address" @click="goOrder(item.id)">
            <view class="consignee"
              >收货人：{{ item.realName
              }}<text class="phone">{{ item.phone }}</text></view
            >
            <view
              >收货地址：{{ item.province }}{{ item.city }}{{ item.district
              }}{{ item.detail }}</view
            >
          </view>
          <view class="operation acea-row row-between-wrapper">
            <radio class="radio" :value="index" :checked="item.isDefault">
              <text>设为默认</text>
            </radio>
            <view class="acea-row row-middle">
              <view @tap.stop="editAddressFn(item.id)">编辑</view>
              <view style="margin-left: 10rpx" @tap.stop="delAddressFn(index)"
                >删除</view
              >
            </view>
          </view>
        </view>
      </radio-group>
      <view
        class="loadingicon acea-row row-center-wrapper"
        v-if="addressList.length > 10"
      >
        <text
          class="loading iconfont icon-jiazai"
          :hidden="loading == false"
        ></text
        >{{ loadTitle }}
      </view>
      <view class="noCommodity" v-if="addressList.length < 1 && page > 1">
        <view class="pictrue">
          <image src="/static/noAddress.png"></image>
        </view>
      </view>
      <view style="height: 120rpx"></view>
    </view>
    <view class="footer acea-row row-between-wrapper">
      <view
        class="addressBnt"
        style="background-color: #df4b43"
        @click="addAddress"
        >添加新地址</view
      >
      <view class="addressBnt wxbnt" @click="getWxAddress">导入微信地址</view>
    </view>
  </view>
</template>

<script>
import {
  getAddressList,
  setAddressDefault,
  delAddress,
  editAddress,
} from "@/api/user.js";

export default {
  data() {
    return {
      addressList: [],
      cartId: "",
      pinkId: 0,
      couponId: 0,
      loading: false,
      loadend: false,
      loadTitle: "加载更多",
      page: 1,
      limit: 20,
	  preOrderNo: ''
    };
  },
  onLoad(options) {
	if (options.preOrderNo) {
		this.preOrderNo = options.preOrderNo
	}
  },
  onShow: function () {
    let that = this;
    that.getAddressList(true);
  },
  methods: {
    onLoadFun: function () {
      this.getAddressList();
    },
    // 授权关闭
    authColse: function (e) {
      this.isShowAuth = e;
    },
    /*
     * 导入微信地址（小程序）
     */
    getWxAddress: function () {
      let that = this;
      uni.authorize({
        scope: "scope.address",
        success: function (res) {
          uni.chooseAddress({
            success: function (res) {
              let addressP = {};
              addressP.province = res.provinceName;
              addressP.city = res.cityName;
              addressP.district = res.countyName;
              addressP.cityId = 0;
              editAddress({
                address: addressP,
                isDefault: true,
                realName: res.userName,
                postCode: res.postalCode,
                phone: res.telNumber,
                detail: res.detailInfo,
                id: 0,
                //type: 1//区别城市id（导入微信地址无城市id需要后台自己查找）;
              })
                .then((res) => {
                  uni.showToast({
                    title: "添加成功",
                    icon: "none",
                  });
                  that.getAddressList(true);
                })
                .catch((err) => {
                  return;
                  uni.showToast({
                    title: JSON.stringify(err),
                    icon: "none",
                  });
                });
            },
            fail: function (res) {
              if (res.errMsg == "chooseAddress:cancel") return;
              uni.showToast({
                title: "取消选择",
                icon: "none",
              });
            },
          });
        },
        fail: function (res) {
          uni.showModal({
            title: "您已拒绝导入微信地址权限",
            content: "是否进入权限管理，调整授权？",
            success(res) {
              if (res.confirm) {
                uni.openSetting({
                  success: function (res) {
                    console.log(res.authSetting);
                  },
                });
              } else if (res.cancel) {
                return;
                uni.showToast({
                  title: "已取消",
                  icon: "none",
                });
              }
            },
          });
        },
      });
    },
    /**
     * 获取地址列表
     *
     */
    getAddressList: function (isPage) {
      let that = this;
      if (isPage) {
        that.loadend = false;
        that.page = 1;
        that.$set(that, "addressList", []);
      }
      if (that.loading) return;
      if (that.loadend) return;
      that.loading = true;
      that.loadTitle = "";
      getAddressList({
        page: that.page,
        limit: that.limit,
      })
        .then((res) => {
          let list = res.data.list;
          let loadend = list.length < that.limit;
          that.addressList = that.$util.SplitArray(list, that.addressList);
          that.$set(that, "addressList", that.addressList);
          that.loadend = loadend;
          that.loadTitle = loadend ? "到底啦，没有数据了" : "加载更多";
          that.page = that.page + 1;
          that.loading = false;
        })
        .catch((err) => {
          that.loading = false;
          that.loadTitle = "加载更多";
        });
    },
    /**
     * 设置默认地址
     */
    radioChange: function (e) {
      let index = parseInt(e.detail.value),
        that = this;
      let address = this.addressList[index];
      if (address == undefined)
        return uni.showToast({
          title: "您设置的默认地址不存在",
          icon: "none",
        });
      setAddressDefault(address.id)
        .then((res) => {
          for (let i = 0, len = that.addressList.length; i < len; i++) {
            if (i == index) that.addressList[i].isDefault = true;
            else that.addressList[i].isDefault = false;
          }
          uni.showToast({
            title: "设置成功",
            icon: "none",
          });
          that.$set(that, "addressList", that.addressList);
        })
        .catch((err) => {
          uni.showToast({
            title: JSON.stringify(err),
            icon: "none",
          });
        });
    },
    /**
     * 编辑地址
     */
    editAddressFn: function (id) {
      uni.navigateTo({
        url: "/subpageC/address_add/address_add?id=" + id,
      });
    },
    /**
     * 删除地址
     */
    delAddressFn: function (index) {
      let that = this,
        address = this.addressList[index];
      uni.showModal({
        content: "确定要删除该地址吗",
        success: () => {

          delAddress(address.id)
            .then((res) => {
              uni.showToast({
                title: "删除成功",
                icon: "none",
              });
              that.addressList.splice(index, 1);
              that.$set(that, "addressList", that.addressList);
            })
            .catch((err) => {
              uni.showToast({
                title: JSON.stringify(err),
                icon: "none",
              });
            });
        },
		complete: (err) => {
			console.log(err)
		}
      });
    },
    /**
     * 新增地址
     */
    addAddress: function () {
      uni.navigateTo({
        url: "/subpageC/address_add/address_add",
      });
    },
    goOrder: function (id) {
      if (this.preOrderNo) {
        uni.redirectTo({
          url:
            "/subpageB/order_commit/order_commit?is_address=1&preOrderNo=" +
            this.preOrderNo +
            "&addressId=" +
            id,
        });
      } else {
      }
    },
  },
  onReachBottom: function () {
    this.getAddressList();
  },
};
</script>

<style lang="scss" scoped>
.address-management {
  padding: 20rpx 30rpx;
}
.address-management.fff {
  background-color: #fff;
  height: 1300rpx;
}

.line {
  width: 100%;
  height: 3rpx;
  image {
    width: 100%;
    height: 100%;
    display: block;
  }
}
.address-management .item {
  background-color: #fff;
  padding: 0 20rpx;
  margin-bottom: 20rpx;
}

.address-management .item .address {
  padding: 35rpx 0;
  border-bottom: 1rpx solid #eee;
  font-size: 28rpx;
  color: #282828;
}

.address-management .item .address .consignee {
  font-size: 28rpx;
  font-weight: bold;
  margin-bottom: 8rpx;
}

.address-management .item .address .consignee .phone {
  margin-left: 25rpx;
}

.address-management .item .operation {
  height: 83rpx;
  font-size: 28rpx;
  color: #282828;
}

.address-management .item .operation .radio text {
  margin-left: 13rpx;
}

.address-management .item .operation .iconfont {
  color: #2c2c2c;
  font-size: 35rpx;
  vertical-align: -2rpx;
  margin-right: 10rpx;
}

.address-management .item .operation .iconfont.icon-shanchu {
  margin-left: 35rpx;
  font-size: 38rpx;
}

.footer {
  position: fixed;
  width: 100%;
  background-color: #fff;
  bottom: 0;
  height: 106rpx;
  padding: 0 30rpx calc(24rpx + env(safe-area-inset-bottom));
  box-sizing: border-box;
}

.footer .addressBnt {
  width: 330rpx;
  height: 76rpx;
  border-radius: 50rpx;
  text-align: center;
  line-height: 76rpx;
  font-size: 30rpx;
  color: #fff;
}

.footer .addressBnt.on {
  width: 690rpx;
  margin: 0 auto;
}

.footer .addressBnt .iconfont {
  font-size: 35rpx;
  margin-right: 8rpx;
  vertical-align: -1rpx;
}

.footer .addressBnt.wxbnt {
  background-color: #fe960f;
}
</style>
